<template>
  <div class="news-list">
    <van-card
      :title="item.title"
      :thumb="item.img_url"
      v-for="item in newsList"
      :key="item.id"
      :thumb-link="'#/home/newsinfo/'+item.id"
    >
      <template #price>
        {{item.add_time}}
      </template>
      <template #num>
        {{'点击'+item.click+'次'}}
      </template>
    </van-card>
  </div>
</template>
<script>
// @相当于 src
// import { getNewsList } from '@/api'
export default {
  data() {
    return {
      newsList: []
    }
  },
  created() {
    this.getNewsList()
  },
  methods: {
    async getNewsList() {
      const res = await this.$http.getNewsList()
      this.newsList = res.data.message
    }
  }
}
</script>
<style lang="scss" scoped>
.news-list {
  .van-card {
    background-color: #fff;
    .van-card__content {
      min-height: 55px;
    }
    .van-card__thumb {
      height: 55px;
    }
    .van-card__title {
      display: -webkit-box;
      -webkit-line-clamp: 1;
      font-size: 14px;
    }
    .van-card__price {
      color: red;
    }
  }
}
</style>